<template>
  <div>
    <h4>我是子</h4>
    <h5>{{count}}</h5>
    <hr>
    <!-- 给绑定事件@ 不要写成：@    
            当子组件的内容发生变化的时候，利用子组件$emit（）来调用函数并且传参，实现子传方法
    -->
    <!-- <Tab @changehandles ="changehandles" /> -->
    <Tab ref="attub"/>
  </div>
</template>

<script>
import Tab from "./Tab/Tab.vue"
export default {
    name:"List",
    components:{
        Tab
    },
    data(){
        return {
            count:0
        }
    },
    // methods:{
    //     changehandles(count){
    //         this.count = count
    //         this.$emit("changehande",count)
    //     }
    // },
    mounted() {
        //也可以设置初始的时候手动设置函数这样就不用在函数上写，利用$ref获取组件，利用this.$refs.xxx.$on设置函数 也可也拿到对应的数据
        
        this.$refs.attub.$on("changehandles",(count)=>{
            this.count = count
            this.$emit("changehande",count)
        })
    },

}
</script>

<style>

</style>